<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-groupPlay-add">

            <div class="form-group">
                <label class="col-sm-3 control-label">图片排序：</label>
                <div class="col-sm-8">
                    <input id="groupPlaySort" name="groupPlaySort" class="form-control" placeholder="请输入图片排序"
                           onkeyup="value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')"/>
                </div>
            </div>
	        <div class="form-group">
            <label class="col-sm-3 control-label">规则图名称：</label>
            <div class="col-sm-8">
                <input id="name" name="name" class="form-control" placeholder="请输入规则图名称" type="text"
                       onblur="checkName()">
            </div>
        </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" id="imgLabel" >图片(1500 * 390)：</label>
                <input id="imgUrl" name="imgUrl" type="hidden" />
                <div class="col-sm-8">
                    <div class="uploder-container" imgType="groupPlay" fileNum="1">
                        <div class="cxuploder" >
                            <div class="queueList">
                                <div class="placeholder">
                                    <div class="filePicker"></div>
                                    <p>将照片拖到这里</p>
                                </div>
                            </div>
                            <div class="statusBar" style="display:none;">
                                <div class="btns">
                                    <!--<div class="jxfilePicker"></div>-->
                                </div>
                                <div class="info"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">上架状态</label>
                <div class="col-sm-8">
                    <select id="status" name="status" class="form-control m-b"
                            th:with="type=${@dict.getType('groupPlayStatus')}">
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">
            <label class="col-sm-3 control-label">跳转链接：</label>
            <div class="col-sm-8">
                <input id="linkUrl" name="linkUrl" class="form-control" placeholder="请输入1~80以内字符" type="text">
            </div>
        </div>
		</form>
	</div>
    <div th:include="include::footer"></div>
    <div th:include="tool/upload/webuploader :: webuploader"></div>
    <script th:src="@{/ajax/libs/select/select2.js}"></script>
    <!--富文本编辑器-->
    <script src="../../../static/tinymce/tinymce.min.js" th:src="@{/tinymce/tinymce.min.js}"></script>
    <script src="../../../static/tinymce/tinymce.common.js" th:src="@{/tinymce/tinymce.common.js}"></script>
    <script type="text/javascript">
		var prefix = ctx + "module/groupPlay";
		$("#form-groupPlay-add").validate({
			rules:{
				xxxx:{
					required:true,
				},
			}
		});

        function checkName() {
            var reg = /^[\u4E00-\u9FA5A-Za-z]+$/;
            var name = document.getElementById("name").value;
            if (!reg.test(name)) {
                return alert("轮播图名称格式不正确!");
            }
        }
		
		function submitHandler() {
            if ($.validate.form()) {
                //图片
                var imgList = getImgList(0);
                $("#imgUrl").val(imgList);
                $.operate.save(prefix + "/add", $('#form-groupPlay-add').serialize());
            }
	    }
	</script>
</body>
</html>
